<template>
    <div id="Detail">
            <mt-header title="详情页">
            <router-link to="/" slot="left">
                <mt-button icon="back">返回</mt-button>
            </router-link>

            </mt-header>
        <hr>
        <div class="item" v-for="(v, index) in list" :key="index">
            <img :src="v.avaUrl" />
            <p>姓名：{{ v.name }}</p>
            <p>年龄：{{v.age}}</p>
            <p>手机号：{{ v.phone }}</p>
            <p>信息：{{ v.detail }}</p>

        </div>

        <van-goods-action>
            <van-goods-action-icon icon="chat-o" text="客服" @click="KeFu()" />
            <van-goods-action-icon icon="cart-o" text="购物车" @click="GouWuC()" />
            <van-goods-action-icon icon="shop-o" text="店铺" @click="shop()" />
            <van-goods-action-button
                type="danger"
                text="立即购买"
                @click="onClickButton"
            />
        </van-goods-action>
    </div>
</template>
<script>
import url from '../tools/url.js';
import { Toast } from 'vant';
export default {
    name: 'Detail',
    data() {
        return {
            list:[],
        }
    },
    methods: {
        KeFu(){
            Toast('小店没有客服！');
        },
        GouWuC(){
            Toast('不让你加入购物车！');
        },
        shop(){
            Toast('小店没有没有店铺！');
        },
        onClickButton(){
            Toast('不能购买！');
        }
    },
    mounted() {
        var id=this.$route.query.v;
        var token=sessionStorage.getItem("token");
        var str=`token=${token}&id=${id}`;
        this.axios.post(url.GETDETAIL,str).then(res=>{
            console.log(res);
            if (res.data.code == 200) {
                 this.list = this.list.concat(res.data.data);
            }
        })
    },
    
}
</script>
<style scoped>
.item img{
    margin-right: 3%;
}
</style>